<template>
	<view class="evalute-content">
		<view class="evalute-list">
			<view class="evalute-item" v-for="(item,index) in planList" :key="index">
				<view class="evalute-item_header">
					<view class="evalute-item_header_name text_black">{{item.title}}</view>
					<view class="evalute-item_header_states">
						<text class="text_active" v-if="item.status!='1'">
							{{item.status==2?'优秀':'改进'}}
							<text v-if="item.is_recommend=='1'">,推荐</text>
						</text>
						<text class="text_black">{{item.name}}</text>
						<text class="text_opblack">{{item.video_url.length==0?'未上传':'已上传'}}</text>
					</view>
				</view>
				<view class="evalute-item_msg" v-if="item.status=='1'">
					<!-- status:状态：1待评价 2:优秀 3良好 4再接再厉 -->
					<video :src="item.video_url"></video>
					<view class="evalute-item_msg_title text_opblack">请选择评价</view>
					<view class="evalute-select">
						<view class="evalute-select_item" 
						v-for="(eitem,eindex) in evaluteStates" 
						:key="eindex" @click="statesChange(eitem,item)"
						:class="item.selectStatus==eitem.id?'evalute-select_item_active':''">
						{{eitem.name}}</view>
					</view>
					<view class="evalute-hot">
						<checkbox-group style="transform:scale(0.7)" class="uni-list" @change="checkboxChange($event,item)">
							<label class="uni-list-cell uni-list-cell-pd">
								<view>
									<checkbox value="1" :checked="item.is_recommend=='1'" color="#FFFFFF"></checkbox>
								</view>
								<view class="text_black">推荐</view>
							</label>
						</checkbox-group>
						<view class="evalute-hot_tips">
							<view class="text_opblack">推荐是指将此学生的训练视频</view>
							<view class="text_opblack">展示到“优秀学生作业”，打开开关表示推荐。</view>
						</view>
					</view>
					<view class="button" @click="save(item)">提交</view>
					<view style="height: 40rpx;"></view>
				</view>
			</view>
		</view>
	</view>
</template>

<script>
	import {getTrainingDetail,getTrainingCheck} from "../../../static/js/api/training.js"
	export default{
		data(){
			return{
				planList:[],
				evaluteStates:[
					{
						name:"优秀",
						id:'2',
					},{
						name:"改进",
						id:'3',
					}
				],
				params:{},
				recommendStatus:[]
			}
		},
		onLoad(option) {
			if(option.data){
				this.params = JSON.parse(option.data)
				this.getData()
			}
		},
		methods:{
			getData(){
				let _this = this
				getTrainingDetail({
					student_id:_this.params.student_id,
					training_id:_this.params.training_id
				}).then(res=>{
					console.log(res)
					if(res){
						res.forEach(item=>{
							item.selectStatus = item.status
						})
						this.planList = res
					}
				})
			},
			checkboxChange(e,item){
				console.log(e)
				if(e.detail.value.length>0){
					item.is_recommend = 1
				}else{
					item.is_recommend = 2
				}
				this.recommendStatus = e.detail.value
			},
			statesChange(item,parentItem){
				parentItem.selectStatus = item.id
			},
			// 提交
			save(item){
				console.log(item)
				let _this = this
				getTrainingCheck({
					id:item.id,
					status:item.selectStatus,
					recommend:_this.recommendStatus.length>0?'1':'2'
				}).then(res=>{
					uni.showModal({
						title: '批改训练计划成功',
						content: `已将${item.name}的训练计划批改成${item.selectStatus==2?'优秀':'改进'}${item.is_recommend=='1'?'和推荐到校园体能页面':''}`,
						showCancel: false,
						confirmText: '好的',
						confirmColor: '#FF6E00',
						success: function(res) {
							if (res.confirm) {
								_this.getData()
							} else if (res.cancel) {
								console.log('用户点击取消');
							}
						}
					})
				})
			}
		}
	}
</script>

<style lang="scss" scoped>
	@import url("../index.scss");
	.text_opblack {
		color: $uni-text-color-opblack;
	}
	
	.text_black {
		color: $uni-text-color-black;
	}
	
	.text_active {
		color: #FF6E00 !important;
	}
	
	.button{
		margin: 40rpx auto 0;
	}
</style>